<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>test</title>
  </head>
  <body style="height: 6000px">
    npm dom监听 Foreach 创建对象 once
    <div>
      <p>p1</p>
      <p>p2</p>
      <p>p3</p>
      <a href="##">a1</a>
    </div>
    <script src="./11-dom.js"></script>
    <script>
      // function add(a, b) {
      //   // console.log(this);
      //   return a + b + this.c;
      // }
      // window.c = 10;
      // const obj = {
      //   c: 20,
      // };

      // console.log(call(add, null, 30, 40)); // 指向window 结果80
      // console.log(call(add, obj, 30, 40)); // 指向obj 结果90

      // apply
      // function add(a, b) {
      //   // console.log(this);
      //   return a + b + this.c
      // }
      // window.c = 10;
      // const obj = {
      //   c: 20
      // }

      // console.log(apply(add, null, [30, 40])); // 指向window 结果80
      // console.log(apply(add, obj, [30, 40]));  // 指向obj 结果90

      // bind
      // function add(a, b) {
      //   // console.log(this);
      //   return a + b + this.c;
      // }
      // window.c = 10;
      // const obj = {
      //   c: 20,
      // };
      // // bind绑定this同时参数全部传递 返回新函数
      // const fn1 = bind(add, obj, 30, 40);
      // console.log(fn1()); // 90

      // // 返回的新函数传递参数
      // const fn2 = bind(add, obj);
      // console.log(fn2(30, 50)); // 100

      // // 先传递一些后面再传递完整
      // const fn3 = bind(add, obj, 30);
      // console.log(fn3(60)); // 110

      // debounce
      // const input = document.querySelector("input");
      // const debounceTask = debounce((e) => {
      //   console.log(e.target.value);
      // }, 500);
      // input.addEventListener("input", debounceTask);

      // // throttle
      // function task() {
      //   console.log("run task");
      // }
      // const throttleTask = throttle(task, 1000);
      // window.addEventListener("scroll", throttleTask);

      // // map
      // const arr = [2, 3, 4, 5];
      // const newArr = map(arr, (item, index) => {
      //   console.log("数组每项", item);
      //   console.log("数组索引", index);
      //   return item * 10;
      // });
      // console.log(newArr);

      // reduce
      // const arr = [1, 2, 3, 4, 5];
      // const result = reduce(
      //   arr,
      //   (pre, cur) => {
      //     return pre + cur;
      //   },
      //   5
      // );
      // console.log(result);

      // filter
      // const arr = [1, {a: 1}, 3, 4, 5];
      // const newArr = filter(arr, (item, index) => {
      //   return item % 2 === 0;
      // });
      // const newArr = arr.filter((item, index) => {
      //   return item;
      // });
      // console.log(newArr === arr);
      // console.log(newArr);
      // newArr[1].a = 2;
      // console.log(arr);

      // console.log(newArr);

      // // find
      // const arr = [1, 2, 3, 4, 5, 1024];
      // const result = find(arr, (item, index) => {
      //   return item > 1000;
      // });
      // console.log(result);

      // findIndex
      // const arr = [1, 2, 3, 4, 5, 1024];
      // const result = findIndex(arr, (item, index) => {
      //   return item > 1000;
      // });
      // console.log(result);

      // every some
      // const arr = [1, 2, 3, 4, 5, 1024];
      // const result1 = every(arr, (item, indx) => {
      //   return item > 0;
      // });
      // const result2 = some(arr, (item, indx) => {
      //   return item > 10000;
      // });
      // console.log(result1);
      // console.log(result2);

      // 数组去重
      // const arr = [1, 2, 3, 3, 4, 4, 5];
      // const newArr = unique3(arr);
      // console.log(newArr);

      // 数组合并
      // const arr1 = [1, 2];
      // const newArr = concat(arr1, 3, [4, 5], [6, 7], 8);
      // console.log(newArr);

      // 数组切片
      // const arr = [1, 2, 3, 4];
      // const newArr = slice(arr, 1, -1);
      // console.log(newArr);

      // 数组扁平化
      // const arr = [1, 2, [3, 4, [5, 6]], 7];
      // const newArr = flat2(arr);
      // console.log(newArr);

      // 数组分块
      // const arr = [1, 2, 3, 4, 5, 6, 7];
      // const newArr = chunk(arr, 3);
      // console.log(newArr);

      // 数组差集
      // const newArr = difference([1, 2, 3, 4], [3, 4, 5]);
      // console.log(newArr);

      // 删除数组某些元素
      // const arr = [1, 2, 3, 4];
      // const newArr = pull(arr, 3, 4, 5);
      // console.log(arr); // [1, 2]
      // console.log(newArr); // [3, 4]

      // const arr = [1, 2, 3, 4, 5];
      // const newArr = pullAll(arr, [3, 4, 5, 6]);
      // console.log(arr); // [1, 2]
      // console.log(newArr); // [3, 4, 5]

      // 获取数组元素
      // const arr = [1, 2, 3, 4, 5];
      // const newArr1 = drop(arr, 2);
      // const newArr2 = dropRight(arr, 3);
      // console.log(newArr1);
      // console.log(newArr2);

      // newInstanceof
      // function People(name) {
      //   this.name = name;
      // }
      // People.prototype.sayHello = function () {
      //   console.log("Hi");
      // };
      // const yun = newInstanceof(People, "yunmu");
      // console.log(yun);
      // yun.sayHello();

      // instanceof
      // function People(name) {
      //   this.name = name;
      // }
      // const yun = newInstanceof(People, "yunmu");
      // console.log(myInstanceof(People, yun)); // true
      // console.log(myInstanceof(Object, yun)); // true
      // console.log(myInstanceof(Object, People)); // true
      // console.log(myInstanceof(Function, People)); // true
      // console.log(myInstanceof(Function, yun)); // false
      // console.log(Object.__proto__ === Function.prototype); // true
      // console.log(Function.__proto__ === Function.prototype); // true
      // console.log(Object.__proto__.__proto__ === Object.prototype); // true
      // console.log(myInstanceof(Object, Object)); // true
      // console.log(myInstanceof(Function, Function)); // true
      // console.log(myInstanceof(Function, Object)); // true
      // console.log(myInstanceof(Object, Function)); // true

      // 合并多个对象
      // const obj1 = { a: [{ x: 2 }, { y: 4 }], b: 1 };
      // const obj2 = { a: { z: 3 }, b: [2, 3], c: "foo" };
      // console.log(mergeObject(obj1, obj2)); // {a: [{x: 2}, {y: 4}, {z: 3}], b: [1, 2, 3], c:"foo"}

      // 浅克隆
      // const obj = { a: 1, b: { m: 2 } };
      // const cloneObj = shallowClone(obj);
      // obj.b.m = 666;
      // console.log(obj === cloneObj); //false
      // console.log(cloneObj);

      // 深克隆
      // const obj = {
      //   a: 1,
      //   b: { m: 2 },
      //   c: [1, 2, 3],
      //   // 不能克隆方法
      //   d() {},
      // };
      // // 会造成循环引用
      // obj.c.push(obj.b);
      // obj.b.j = obj.c;
      // const cloneObj = deepClone2(obj);
      // obj.c.push(666);
      // // console.log(obj === cloneObj); //false
      // console.log(obj);
      // console.log(cloneObj);

      // // 字符串反转
      // console.log(reverseString("hello yunmu 2022年不要孤单了"));

      // // 字符串回文
      // console.log(palindrome("lil"));

      // // // 字符截取
      // console.log(truncate("hello", 3));

      // // 事件绑定
      addEventListener(
        "div",
        "click",
        function () {
          console.log(this.innerHTML);
        },
        "a"
      );

      // eventBus
      // eventBus.on("login", (data) => {
      //   console.log(`用户已经登陆,数据${data}`);
      // });

      // eventBus.on("login", (data) => {
      //   console.log(`用户已经登陆,数据${data}`);
      // });

      // eventBus.on("logout", (data) => {
      //   console.log(`用户已经退出,数据${data}`);
      // });

      // setTimeout(() => {
      //   eventBus.emit("login", "云牧");
      //   eventBus.emit("logout", "云牧");
      // }, 1000);

      // // eventBus.off("login");
      // // eventBus.off();

      // const id1 = PubSub.subscribe("pay", (data) => {
      //   console.log("商家接受到了订单", data);
      // });
      // const id2 = PubSub.subscribe("pay", (data) => {
      //   console.log("骑手接受到了订单", data);
      // });

      // const id3 = PubSub.subscribe("cancel", (data) => {
      //   console.log("买家取消了订单", data);
      // });
      // PubSub.unsubscribe(id1);
      // PubSub.publish("pay", {
      //   title: "鱼香肉丝",
      //   price: 20,
      //   address: "xxx",
      // });
      // PubSub.publish("cancel", {
      //   title: "鱼香肉丝",
      //   price: 20,
      //   address: "xxx",
      // });
      // const url1 =
      //   "https://www.fastmock.site/mock/13089f924ad68903046c5a61371475c4/api/register";

      // const url2 =
      //   "https://www.fastmock.site/mock/13089f924ad68903046c5a61371475c4/api/post";
      // const params = {
      //   a: 1,
      //   b: 2,
      //   c: 3,
      // };
      // const data = {
      //   name: "yunmu",
      // };
      // axios({
      //   url: url1,
      //   method: "POST",
      //   params,
      //   data,
      // }).then((res) => {
      //   console.log(res);
      // });

      // axios
      //   .get(url2, {
      //     params,
      //   })
      //   .then((res) => console.log(res));

      // const p = new MyPromise((reslove, reject) => {
      //   reslove("111");
      // });

      // p.then((res) => {
      //   console.log(res);
      // })
      //   .then((res) => {
      //     console.log(222);
      //   })
      //   .then((res) => {
      //     console.log(333);
      //   })
      //   .catch((e) => {
      //     console.warn(e);
      //   });

      // console.log(typeOf(1)); // Number
      // console.log(typeOf("1")); // String
      // console.log(typeOf(true)); // Boolean
      // console.log(typeOf(null)); // Null
      // console.log(typeOf(undefined)); // Undefined
      // console.log(typeOf(Symbol(1))); // Symbol
      // console.log(typeOf({})); // Object
      // console.log(typeOf([])); // Array
      // console.log(typeOf(function () {})); // Function
      // console.log(typeOf(new Date())); // Date

      // let pay = once(function (money) {
      //   console.log(`支付：${money} RMB`);
      // });
      // pay(5);
      // pay(5);
      // pay(5);

      // function getSum(a, b, c) {
      //   return a + b + c;
      // }

      // let curried = curry(getSum);
      // console.log(curried(1)(2)(3)); // 6
      // console.log(curried(1)(2, 3)); // 6
      // console.log(curried(1, 2)(3)); // 6
      // console.log(curried(1, 2, 3)); // 6
      // const user = getParams("http://www.baidu.com?user=yunmu&age=16");
      // console.log(user); // {user: 'yunmu', age: '16'}
    </script>

    <script src="./dist/utils.js"></script>
    <script>
      // 测试
      yUtils.eventBus.on("login", (data) => {
        console.log(`用户已经登陆,数据${data}`);
      });

      yUtils.eventBus.on("login", (data) => {
        console.log(`用户已经登陆,数据${data}`);
      });

      yUtils.eventBus.on("logout", (data) => {
        console.log(`用户已经退出,数据${data}`);
      });

      setTimeout(() => {
        yUtils.eventBus.emit("login", "云牧");
        yUtils.eventBus.emit("logout", "云牧");
      }, 1000);

      // yUtils.eventBus.off("login");
      // yUtils.eventBus.off();
      const p = yUtils.MyPromise.resolve;
      console.log(p);
    </script>
  </body>
</html>
